iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 14
0
自我挑戰組

網頁工程師在windows上的求生秘訣系列 第 14

Chrome 好用Plugin推薦(二)

  • 分享至 

  • xImage
  •  

昨天提到的比較像是一般在查詢資料時比較常使用的功能,這次要提的是跟前端開發比較相關的功能

ModHeader

這個功能可以讓你直接在網頁要求直接加上header,如果開發時跟api要資料需要有Authorization的header,就可以直接使用這個套件來模擬
沒使用前取得400

使用後可以正確取得資料

Wappalyzer / WhatRuns

這兩個工具可以拿來查看你現在瀏覽的網頁是使用甚麼樣的技術,或是網頁伺服器的來源
舉例來說
如果想知道說Youtube有用了甚麼技術,點開可以看到他有使用Hammer.js

就可以知道說如果想要處理畫面上的手勢,可以使用Hammer.js來操作,雖然說不是全部都看得到,但可以讓你在看到一個很厲害的網頁時,了解說他是使用甚麼樣的技術來完成他的

uBlock Origin / AdBlock

這邊提到這個擋廣告的,是要提醒說有時候在開發的時候,有些功能會沒辦法出現,有可能是因為這兩個工具把你寫好的畫面認為是廣告,就把你遮掉了,之前在開發功能時,因為有用到覆蓋整個畫面的iframe,然後這個工具就認為這個部分是廣告,導致我怎麼試都顯示不出來,最後關掉後就正常了

Vue.js devtools

開發VUE必備工具,無論是查看data,vuex,或是可以透過這個工具直接透過console使用內部的function,都超級好用,一定要裝!!!
要直接使用某個component裡面的data或是method,只要先點選你想操作的component,他旁邊會有這個component的代碼,就可以直接在console中取得這個component,在測試功能中很方便的


上一篇
Chrome 好用Plugin推薦(一)
下一篇
你所不知道的google小技巧(一)
系列文
網頁工程師在windows上的求生秘訣30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言